<html>
<head>
    <script src="socket.io.min.js" type="text/javascript"></script>
    <script src="client.js" type="text/javascript"></script>
    <script src="options.js" type="text/javascript"></script>
    <title>Django desktop Notifications</title>
    <style>
      /* Clone the look and feel of "chrome://" pages. */
      body { margin: 10px; font: 84% Arial, sans-serif; }
      h1 { font-size: 156%; }
      h1 img { margin: 1px 5px 0 1px; vertical-align: middle; }
      h2 { border-top: 1px solid #9cc2ef; background-color: #ebeff9; padding: 3px 5px; font-size: 100%; }
    </style>
</head>
<body>
<script lang="text/javascript">
onload = function() {
    var websocket_status_p = document.getElementById("websocket_status");
    var django_status_p = document.getElementById("django_status");
    var background = chrome.extension.getBackgroundPage();
    
    if (background.n_socket && background.n_socket.connected)
    {
        websocket_status_p.innerHTML = "Websocket connected.";
    } else {
        websocket_status_p.innerHTML = "Websocket DISCONNECTED. BAD!";
    }
    
    if (background.is_loggedin)
    {
        django_status_p.innerHTML = "Django connected as: "+background.current_username;
    } else {
        django_status_p.innerHTML = "Not connected to django. BAD!";
    }
};
</script>
    <h2>Status of desktop notifications</h2>
    <p id="websocket_status"></p>
    <p id="django_status"></p>
</body>
</html>